<!-- 系统Setup板块  -- 平台信息页面 -->
<template>
  <div>
    <el-tabs type="border-card">
      <el-tab-pane label="Basic Data">
        <r-search
          ref="search"
          labelWidth="220px"
          labelPosition="right"
          :searchData="searchData"
          :searchForm="searchForm"
          :searchHandle="searchHandle"
          :inline="false"
          :searchRules="searchRules"
        />
      </el-tab-pane>
      <el-tab-pane label="Operational Data">
        <r-search
          ref="operateInfo"
          labelWidth="400px"
          labelPosition="right"
          :searchData="operateData"
          :searchForm="operateForm"
          :searchHandle="operateHandle"
          :inline="false"
          :searchRules="operateRules"
        />
      </el-tab-pane>
      <!-- <el-tab-pane label="运营Setup">
				<div>
					<div class="contentBattery">开启Deposit提现审核：</div>
					<el-switch v-model="depositCheckEnable" />
				</div>
				<el-button :class="isDepositCheckEnable ? 'btnBlue' : 'btn'" @click="SetdepositCheckEnableFn"
					:disabled="isDepositCheckEnable">Save</el-button>
			</el-tab-pane> -->

      <!--        <el-tab-pane label="富文本管理">-->
      <!--          <div class="c1">-->
      <!--            <div>-->
      <!--              <div>关于我们:</div>-->
      <!--              <div>-->
      <!--                <r-tinymce v-model="value1"></r-tinymce>-->
      <!--              </div>-->
      <!--            </div>-->

      <!--            <div>-->
      <!--              <div>User协议:</div>-->
      <!--              <div>-->
      <!--                <r-tinymce v-model="value2"></r-tinymce>-->
      <!--              </div>-->
      <!--            </div>-->

      <!--            <div style="text-align: center;margin-top:30px;"><el-button @click="submit2" type="primary">Save</el-button></div>-->
      <!--          </div>-->

      <!--        </el-tab-pane>-->
    </el-tabs>
  </div>
</template>

<script>
export default {
  name: "platform_information",
  data() {
    return {
      value1: "",
      value2: "",
      searchData: {
        projectName: "",
        logoUrl: "",
        serverTel: "",
        email: "",
        workTime: "",
        workTimeStart: "",
        workTimeEnd: "",
        company: "",
        address: ""
      },
      searchForm: [
        {
          type: "input",
          label: "Project Name",
          placeholder: "Project Name",
          prop: "projectName",
          width: 200
        },
        {
          type: "upload",
          label: "Project logo",
          prop: "logoUrl",
          width: 200,
          success: (response, file, fileList) =>
            this.onsuccess(response, file, fileList)
        },
        {
          type: "textarea",
          label: "Work phone",
          placeholder: "Work phone",
          prop: "serverTel",
          width: 200
        },
        {
          type: "input",
          label: "Official Mailbox",
          placeholder: "Official Mailbox",
          prop: "email",
          width: 250
        },
        {
          type: "time",
          label: "Start Of Working Hours",
          placeholder: "Start Of Working Hours",
          prop: "workTimeStart",
          width: 200
        },
        {
          type: "time",
          label: "End Of Working Hours",
          placeholder: "End Of Working Hours",
          prop: "workTimeEnd",
          width: 200
        },
        {
          type: "input",
          label: "Company Name",
          placeholder: "Company Name",
          prop: "company",
          width: 200
        },
        {
          type: "input",
          label: "Company Address",
          placeholder: "Company Address",
          prop: "address",
          width: 200
        }
      ],
      searchHandle: [
        { type: "primary", label: "Save", handle: e => this.elFormSubmit() }
      ],
      searchRules: {
        projectName: [
          { required: true, message: "Please Enter", trigger: "blur" }
        ],
        logoUrl: [
          { required: true, message: "Please Upload", trigger: "blur" }
        ],
        serverTel: [
          { required: true, message: "Please Enter", trigger: "blur" }
        ],
        email: [{ required: true, message: "Please Enter", trigger: "blur" }],
        workTimeStart: [
          { required: true, message: "Please Enter", trigger: "blur" }
        ],
        workTimeEnd: [
          { required: true, message: "Please Enter", trigger: "blur" }
        ],
        company: [{ required: true, message: "Please Enter", trigger: "blur" }],
        address: [{ required: true, message: "Please Enter", trigger: "blur" }]
      },

      // 运营资料  start
      operateData: {
        id: "",
        wxAppId: "", // 小程序APPID
        wxSecrect: "", // 小程序秘钥Secrect
        wxMchName: "", // 商户Name
        wxMchId: "", // 商户号
        wxMchKey: "", // WeChat商户Key
        gzhAppId: "", // 公众号APPID
        gzhSecrect: "", // 公众号秘钥Secrect
        wxCertPath: "", // 证书路径（需要调上传接口）
        wxPemkeyPath: "", // 私钥证书key.pem路径	（需要调上传接口）
        wxSerialNo: "", // 证书序列号
        msgTemplateId: "", // 公众号消息(通用)Templateid
        appletTemplate1: "", // 小程序消息(通用)Templateid （结算用）
        appletTemplate2: "", // 小程序消息(通用)Templateid （End Order用）
        smsAccessKeyId: "", // 短信keyid
        smsAccessKeySecret: "", // 短信key
        smsSignName: "", // 短信签名Name
        smsCode: "" // 短信验证码Templatecode
      },
      operateForm: [
        {
          type: "input",
          label: "Applet APPID",
          placeholder: "",
          prop: "wxAppId",
          width: 400
        },
        {
          type: "input",
          label: "Applet Secret Key",
          placeholder: "",
          prop: "wxSecrect",
          width: 400
        },
        {
          type: "input",
          label: "Commercial Tenant Name",
          placeholder: "",
          prop: "wxMchName",
          width: 400
        },
        {
          type: "input",
          label: "Commercial Tenant Number",
          placeholder: "",
          prop: "wxMchId",
          width: 400
        },
        {
          type: "input",
          label: "WeChat Commercial Tenant Key",
          placeholder: "",
          prop: "wxMchKey",
          width: 400
        },
        {
          type: "input",
          label: "Official Accounts APPID",
          placeholder: "",
          prop: "gzhAppId",
          width: 400
        },
        {
          type: "input",
          label: "Official Accounts Secret Key",
          placeholder: "",
          prop: "gzhSecrect",
          width: 400
        },
        {
          type: "input",
          label: "Certificate Path (call the upload interface)",
          placeholder: "",
          prop: "wxCertPath",
          width: 400
        },
        {
          type: "input",
          label: "Private Key Certificate Key.Pem Path (call upload interface)",
          placeholder: "",
          prop: "wxPemkeyPath",
          width: 400
        },
        {
          type: "input",
          label: "Certificate Serial Number",
          placeholder: "",
          prop: "wxSerialNo",
          width: 400
        },
        {
          type: "input",
          label: "Official Accounts Message(generic)Templateid",
          placeholder: "",
          prop: "msgTemplateId",
          width: 400
        },
        {
          type: "input",
          label: "Applet Message(generic)Templateid(use for settlement)",
          placeholder: "",
          prop: "appletTemplate1",
          width: 400
        },
        {
          type: "input",
          label: "Applet Message(generic)Templateid(End Order use)",
          placeholder: "",
          prop: "appletTemplate2",
          width: 400
        },
        {
          type: "input",
          label: "Text Message keyid",
          placeholder: "",
          prop: "smsAccessKeyId",
          width: 400
        },
        {
          type: "input",
          label: "Text Message key",
          placeholder: "",
          prop: "smsAccessKeySecret",
          width: 400
        },
        {
          type: "input",
          label: "SMS Signature Name",
          placeholder: "",
          prop: "smsSignName",
          width: 400
        },
        {
          type: "input",
          label: "SMS Verification Code Template",
          placeholder: "",
          prop: "smsCode",
          width: 400
        }
      ],
      operateHandle: [
        {
          type: "primary",
          label: "Save",
          handle: e => this.elOperateFormSubmit()
        }
      ],
      operateRules: {
        /* wxAppId: [{ required: true, message: 'Please Enter', trigger: 'blur' }],
				wxSecrect: [{ required: true, message: 'Please Enter', trigger: 'blur' }],
				wxMchName: [{ required: true, message: 'Please Enter', trigger: 'blur' }],
				wxMchId: [{ required: true, message: 'Please Enter', trigger: 'blur' }],
				wxMchKey: [{ required: true, message: 'Please Enter', trigger: 'blur' }],
				gzhAppId: [{ required: true, message: 'Please Enter', trigger: 'blur' }],
				gzhSecrect: [{ required: true, message: 'Please Enter', trigger: 'blur' }],
				wxCertPath: [{ required: true, message: 'Please Enter', trigger: 'blur' }],
				wxPemkeyPath: [{ required: true, message: 'Please Enter', trigger: 'blur' }],
				wxSerialNo: [{ required: true, message: 'Please Enter', trigger: 'blur' }],
				msgTemplateId: [{ required: true, message: 'Please Enter', trigger: 'blur' }],
				appletTemplate1: [{ required: true, message: 'Please Enter', trigger: 'blur' }],
				appletTemplate2: [{ required: true, message: 'Please Enter', trigger: 'blur' }],
				smsAccessKeyId: [{ required: true, message: 'Please Enter', trigger: 'blur' }],
				smsAccessKeySecret: [{ required: true, message: 'Please Enter', trigger: 'blur' }],
				smsSignName: [{ required: true, message: 'Please Enter', trigger: 'blur' }],
				smsCode: [{ required: true, message: 'Please Enter', trigger: 'blur' }] */
      },
      // 运营资料  end

      depositCheckEnable: false,
      isDepositCheckEnable: false
    };
  },
  mounted() {
    this.getData();
    this.getOperateConfig();
    this.GetdepositCheckEnableFn();
  },
  methods: {
    // 修改运营Setup--Deposit是否审核
    async SetdepositCheckEnableFn() {
      this.isDepositCheckEnable = true;
      this.depositCheckEnable = this.depositCheckEnable ? 1 : 2;
      let res = await this.apis.operatorSettingEdit({
        depositCheckEnable: this.depositCheckEnable
      });
      this.$message({
        type: res.code == 200 ? "success" : "error",
        message: res.msg
      });
      setTimeout(() => {
        this.isDepositCheckEnable = false;
      }, 2000);
      this.GetdepositCheckEnableFn();
    },
    // 获取运营Setup--Deposit是否审核
    async GetdepositCheckEnableFn() {
      let res = await this.apis.operatorSettingGet();
      this.depositCheckEnable =
        res.data.depositCheckEnable === 1 ? true : false;
      console.log(333, this.depositCheckEnable);
    },

    async getData() {
      var res = await this.apis.aboutUs_getInfo({});
      var data = res.data || {};
      this.searchData.projectName = data.projectName;
      this.searchData.logoUrl = data.logoUrl;
      this.searchData.serverTel = data.serverTel;
      this.searchData.email = data.email;

      this.searchData.company = data.company;
      this.searchData.address = data.address;
      this.searchData.id = data.id;
      if (data.workTime) {
        this.searchData.workTimeStart = data.workTime.split("-")[0];
        this.searchData.workTimeEnd = data.workTime.split("-")[1];
      } else {
        this.searchData.workTimeStart = "";
        this.searchData.workTimeEnd = "";
      }
    },
    async getOperateConfig() {
      // const res = await this.apis.getOperateConfig()
      // this.operateData = res.data
    },
    onsuccess(response, file, fileList) {
      console.log(response);
      this.searchData.logoUrl = response.fileName;
    },
    elFormSubmit() {
      this.$refs.search.$refs.ruleForm.validate(valid => {
        if (valid) {
          this.submit();
        }
      });
    },
    elOperateFormSubmit() {
      this.$refs.operateInfo.$refs.ruleForm.validate(valid => {
        if (valid) {
          this.operateSubmit();
        }
      });
    },
    // 运营资料Edit
    async operateSubmit() {
      const res = await this.apis.editOperateConfig(this.operateData);
      this.$message({
        message: "Operations Success",
        type: "success"
      });
    },
    async submit() {
      var res = await this.apis.aboutUs_saveOrUpdate({
        projectName: this.searchData.projectName,
        logoUrl: this.searchData.logoUrl,
        serverTel: this.searchData.serverTel,
        email: this.searchData.email,
        workTime:
          this.searchData.workTimeStart + "-" + this.searchData.workTimeEnd,
        company: this.searchData.company,
        address: this.searchData.address,
        id: this.searchData.id
      });
      this.$message({
        message: "Operations Success",
        type: "success"
      });
    },
    async submit2() {
      var res = await this.apis.saveInfo({
        aboutAs: this.value1,
        protocol: this.value2
      });
      this.$message({
        message: "Operations Success",
        type: "success"
      });
    }
  }
};
</script>

<style scoped lang="scss">
.c1 {
  > div {
    > div:nth-child(1) {
      line-height: 40px;
      font-weight: bold;
      font-size: 18px;
    }
  }
}

/deep/ .el-tabs__item:hover {
  color: #6bdb85 !important;
  cursor: pointer;
  border: 1px solid #6bdb85;
}

/deep/ .el-tabs__item.is-active {
  color: #6bdb85 !important;
  // border: 1px solid #6bdb85;
}

.contentBattery {
  font-size: 15px;
  font-weight: 700;
  margin-bottom: 15px;
}

.btn {
  margin-top: 50px;
  background-color: #6bdb85;
  color: #fff;
}

.btnBlue {
  margin-top: 50px;
  background-color: #f66c6c;
  color: #fff;
}
</style>
